<template>
	<view class="wap">
		<view class="head">
			<view class="head-login flex-x-center flex-y-center">
				<image src="@/static/img/logo.png">
				</image>
			</view>
			<view class="content">
				<view class="title">选择地区</view>
				<radio-group class="title2" @change="radioChange">
					<radio :value="item.id" :checked="item.id === region_id" v-for="(item,index) in tabList" :key="index">{{item.name}}</radio>
				</radio-group>
				<view class="title">申请获取以下权限</view>
				<view class="title2">获得你的公开信息(昵称，头像等)</view>
			</view>
			<view class="bottom" @click="login()">
				<button class="" type="default">授权登录</button>
			</view>
		</view>
		<!---->
	</view>
</template>

<script>
	import {wxLogin,appid,getCityList} from '../../apirequest/api.js';
	export default {
		data() {
			return {
				region_id:0,
				tabList:[],
			}
		},
		onShow() {
			this.region_id = uni.getStorageSync('region_id');
			this.loadData();
		},
		methods: {
			radioChange(event) {
			   var value = event.detail.value;
			   uni.setStorageSync('region_id',value);
			},
			//获取数据
			loadData: function() {
				getCityList({region_id:0}).then((res) => {
					if (res.code == 1) {
						this.tabList = res.data.tabList;
						this.weChatAuth();
					}
				}).catch(err => {
					console.log(err)
				});
			},
			login:function(){
				let region_id = uni.getStorageSync('region_id');
				if (!region_id) {
					uni.showToast({
						title:'请先选择地区',
						icon:'error'
					});
					return;
				}
				// 获取appid
				appid().then(res => {
					let redirectUrl = encodeURIComponent(window.location.href.replace(/[?&]code=(\w+)/i, '').replace(/&state=fanpingsanguo/ig, ''));
					window.location.replace(`https://open.weixin.qq.com/connect/oauth2/authorize?appid=${res.data.app_id}&redirect_uri=${redirectUrl}&response_type=code&scope=snsapi_userinfo&state=fanpingsanguo#wechat_redirect`);
				});
			},
			getUrlParam(name){
			    var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
			    var r = window.location.search.substr(1).match(reg);
			    if (r!=null) return unescape(r[2]); return null;
			},
			// 微信授权
			weChatAuth() {
				let code = this.getUrlParam('code');
				console.log(code)
				let old_code = uni.getStorageSync('old_code');
				if (code && old_code != code) {
					uni.setStorageSync('old_code', code);
					let redirect_url = uni.getStorageSync('redirect_url');
					console.log(redirect_url);
					wxLogin({
						code: code,
					}).then(res => {
						if (res.code==1) {
							uni.setStorageSync('token', res.data.userinfo.token);
							uni.showToast({
								title:'登录成功',
								icon:'success'
							});
							setTimeout(function(){
								uni.reLaunch({
									url:'/pages/index/index',
								});
							},1000);
						} else {
							uni.showToast({
								title:res.msg,
								icon:'error'
							});
						}
					});
				} 
			},
		}
	}
</script>

<style>
	.wap .head {
		margin: 9px 14px
	}

	.wap .head .head-login {
		width: 100%;
		height: 192px;
		border-bottom: 1px solid #ccc
	}

	.wap .head .head-login image {
		width: 96px;
		height: 96px;
		border-radius: 9px
	}
	.wap .head .content radio{
		margin-right: 20rpx;
	}
	.wap .head .content {
		margin: 38px 0px
	}

	.wap .head .content .title {
		margin-bottom: 30rpx
	}

	.wap .head .content .title2 {
		margin-left: 25rpx;
		margin-bottom: 20px;
	}

	.wap .head .bottom button {
		color: #fff;
		border: none;
		background-color: #ffe786;
		background-image: linear-gradient(to, right, #f4ac1c, #ffe786);
		border-radius: 29px
	}

	.wap .head .bottom button::after {
		width: 0;
		height: 0
	}

	.wap .head .sign {
		text-align: center
	}

	.wap .head .sign-bottom {
		display: flex;
		align-items: center;
		justify-content: center;
		margin-top: 9px;
		font-size: 28rpx;
	}

	.wap .head .sign-bottom text {
		font-weight: 700;
		color: #f4ac1c
	}

	.wap .head .sign-bottom .label {
		display: flex;
		align-items: center;
		color: #9d9d9d
	}

	.wap .head .sign-bottom .label .checkbox {
		-webkit-transform: scale(.7);
		transform: scale(.7)
	}

	.wap .popup-content {
		background-color: #fff;
		width: 283px;
		border-radius: 17px
	}

	.wap .popup-center {
		text-align: center
	}

	.wap .popup-title {
		color: #333;
		font-weight: 700;
		font-size: 36rpx;
		;
		padding: 19px 0px
	}

	.wap .popup-text {
		padding: 0px 0px 19px 0px;
		color: #bec1c7;
		font-size: 30rpx;
	}

	.wap .popup-cancel {
		text-align: center;
		width: 50%;
		color: #333;
		font-weight: 700;
		padding: 9px 0px 19px 0px
	}

	.wap .popup-confirm {
		text-align: center;
		width: 50%;
		color: #0da3db;
		background-color: #fff;
		font-weight: 700;
		padding: 9px 0px 19px 0px;
		border-radius: 17px
	}

	.wap .popup-confirm::after {
		width: 0;
		height: 0
	}
</style>
